<template>
  <div>
    <div style="display: flex;justify-content: space-between;margin-bottom: 12px">
      <el-input v-model="search"
                placeholder="请输入内容"
                style="width: 250px;"
                @change="fetchList">
        <i slot="prefix" class="el-input__icon el-icon-search"></i>
      </el-input>
      <el-button size="mini" type="primary" @click="add">新建</el-button>
    </div>
    <el-table
        :data="tableData"
        style="width: 100%">
      <el-table-column
          label="岗位名称"
          prop="postName"
          width="180">
      </el-table-column>
      <el-table-column
          label="岗位限制人数"
          prop="limitPersonName"
          width="180">
      </el-table-column>
      <el-table-column
          label="岗位工作内容"
          prop="postContent">
      </el-table-column>
      <el-table-column
          fixed="right"
          label="操作"
          width="100">
        <template slot-scope="scope">
          <el-button size="small" type="text" @click="editRow(scope.row)">编辑</el-button>
          <el-button size="small" style="color:red;" type="text" @click="deleteRow (scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <add-edit ref="addEdit" @callBack="fetchList"/>
  </div>
</template>
<script>
import addEdit from "@/views/postTransfer/components/add-edit";
import {postdel, postGetList} from "@/utils/post";

export default {
  data() {
    return {
      search: undefined,
      tableData: [],

    }
  }, methods: {
    add() {
      this.$refs.addEdit.openByRecord({title: '发布'})

    },
    async fetchList() {
      const res = await postGetList({search: this.search})
      if (res.status === 'success') {
        this.tableData = res.data
      }
    },
    async deleteRow(id) {
      const res = await postdel(id)
      if (res.status === 'success') {
        this.fetchList()
      }
    },
    editRow(row) {
      this.$refs.addEdit.openByRecord({...row, title: '编辑'})
    }
  }, created() {
    this.fetchList()
  },
  components: {addEdit}
}
</script>